import React from "react";
import { connect } from "react-redux";
import { loadGetListHeadDataAsync } from "@/components/main/index/actionCreator.js";
import { Listone } from "@/components/main/list/styled";
import Swiper from "@/components/common/swiper.jsx";
class List extends React.Component {
  render() {
    // console.log(this.props.listDataSnv.toJS().theatre_list);
    var data = this.props.listDataSnv.toJS().theatre_list;
    var listSvn = [];
    for (var n in data) {
      listSvn.push(data[n]);
    }
    return (
      <Listone>
        <h2>剧院</h2>
        <div className="list">
          {listSvn.map((item, index) => (
            <li key={index} className="partly">
              <div className="fourp">
                <img src={item.pic} alt="item.name" className="imgtop" />
                <p className="titlebar">{item.name}</p>
                <p className="byline">{item.count}场在售演出</p>
                <p>
                  <a href={item.theatre_url}>...</a>
                </p>
              </div>
              <Swiper
                id={"hotthealist"}
                config={{
                  slidesPerView: 3,
                  spaceBetween: 30
                }}
              >
                {item.showList.map((value, idx) => (
                  <div className="swiper-slide" key={idx}>
                    <div className="hotthea_show">
                      <p className="hotthea_time">
                        {value.show_time}
                        <i></i>
                      </p>
                      <img src={value.pic} alt={value.schedular_name} />
                    </div>
                  </div>
                ))}
              </Swiper>
            </li>
          ))}
        </div>
      </Listone>
    );
  }
  componentDidMount() {
    this.props.loadGetListHeadDataAsync.bind(this)();
  }
}
const mapStateToProps = state => {
  return {
    listDataSnv: state.getIn(["indexReducer", "listDataSnv"])
  };
};
const mapDispatchToProps = dispatch => {
  return {
    loadGetListHeadDataAsync() {
      loadGetListHeadDataAsync(dispatch, "");
    }
  };
};
export default connect(mapStateToProps, mapDispatchToProps)(List);
